<template>
	<view class="bizPage">
		<status-bar title="发布任务" />
		<!-- 普通员工无权发布工作任务 -->
		<view class="tabs bgwhite" :style="{top: totalHeight + 'px'}" v-if="showTabs">
			<up-tabs :list="tabList" :current="current" :scrollable="false" :lineColor="mainStore.color" lineWidth="40" :activeStyle="{color:'#222',fontWeight:'bold'}"
				@click="tabClick"></up-tabs>
		</view>
		<view class="padding20" :style="{'margin-top': showTabs ? '44px' : '0'}">
			<block v-if="current == 0 && showTabs">
				<work :defaultValue="workDefaultValue" />
			</block>
			<block v-else>
				<process ref="processRef" :defaultType="processType" :defaultValue="defaultValue" :processInstanceId="processInstanceId" />
			</block>
		</view>
	</view>
</template>

<script setup>
	import { ref, computed } from 'vue'
	import { onLoad, onShow } from '@dcloudio/uni-app'
	import { useMainStore } from '@/stores/index'
	import statusBar from '../components/statusBar.vue'
	import work from './components/work.vue'
	import process from './components/process.vue'
	
	const mainStore = useMainStore()
	const totalHeight = computed(() => {
		return mainStore.statusBarHeight + mainStore.navBarHeight
	})
	const showTabs = computed(() => {
		return mainStore.employeeType > 0 && !processInstanceId.value
	})

	const tabList = ref([
		{ name: '工作任务' },
		{ name: '流程任务' }
	])
	const current = ref(0)
	const tabClick = ({index}) => {
		current.value = index
	}

	const processRef = ref(null)
	const processType = ref('')
	const defaultValue = ref('')
	const workDefaultValue = ref('')
	const processInstanceId = ref('') // 修改流程表单会传

	onLoad((e) => {
		if(e.processType) {
			processType.value = e.processType
			current.value = 1
		}
		if(e.defaultValue) defaultValue.value = e.defaultValue
		if(e.workDefaultValue) workDefaultValue.value = e.workDefaultValue
		if(e.processInstanceId) processInstanceId.value = e.processInstanceId
	})

	onShow(() => {
		let userId = uni.getStorageSync('targetUserId')
		if(userId) {
			processRef.value.pageShow(userId)
			uni.removeStorageSync('targetUserId')
		}
	})
</script>

<style lang="scss" scoped>
	.bizPage {
		min-height: 100vh;
		background: #F9F9F9;
	}  
	.tabs {
		width: 100%;
		position: fixed;
		left: 0;
		z-index: 11;
	}
</style>
